<!-- 
	주문완료
	작성날짜 : 10월 19일
	작성자 : 이민선
 -->
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
	#head {height:242px}
	#content {position: relative; height:100%; margin:242px 0 100px 0;}
	#footer {height:100px;}

	/*
		 주문 완료 이미지
	*/
 	#content {width:1100px; margin:0 auto; padding-bottom: 20px;}
	#top_line {width:100%; margin:0 auto; height:1px; border-bottom:1px solid #bfbfbf;}	
	#box {width: 1100px; margin:0 auto;} 
	#finish {padding: 50px 0 0 300px;}
	
	/*
		주문내역확인
	*/
 	#order_finish {width: 1100px; margin:0 auto;}
	.order_title {padding-top: 20px;}
	.order_table {width: 100%; border-top: 2px solid #7e7e7e;}
	.order_table th {padding:13px 0 8px; font-weight:normal; font-size:12px; text-align:center; color:#414141; border-bottom:1px solid #e9e9e9;}
	.order_table td {padding:10px 0; font-weight:normal; font-size:12px; color:#333; border-bottom:1px solid #e9e9e9;}
	.order_table td.left {font-weight:bold; text-align:left;}
	.order_tbody {border-top: 1px solid #bfbfbf;}
	.thead {background-color:#fffbe7;}
	
	#order_finish .order_title {margin:50px 0 17px;}
	#order_finish .order_email {padding:67px 0 25px; text-align:center; font-weight:bold; font-size:16px;}
	#order_finish .order_email span {color:#fe6500;}
	#order_finish .btn {padding-bottom:65px;}
	#order_finish .bottom_menu {height:118px; background:#eee;}
	#order_finish .bottom_menu li {float:left; padding:18px 0 0 30px;}  

	/*
		주문자정보확인, 배송지정보확인, 결제정보확인
	*/
 	.table_style {width:100%; border-top:2px solid #7e7e7e; border-collapse:collapse;}
	.table_style th {padding:10px 0 7px; font-weight:normal; font-size:12px; text-align:center; border-bottom:1px solid #e9e9e9;}
	.table_style td {padding:10px 0 7px; font-size:12px; text-align:center; border-bottom:1px solid #e9e9e9;}
	.table_style td.left {padding-left:20px; font-weight:bold; text-align:left;}
	
	.order_title2 {padding-top: 20px;}
	.table_style2 {width:100%; border-top:2px solid #7e7e7e; border-bottom:2px solid #ebebeb;}
	.table_style2 th {width:200px;  padding:8px 0 8px 30px; font-weight:bold; font-size:12px; text-align:left; background:#f9f9f9; border-bottom:1px solid #e9e9e9;}
	.table_style2 td {padding:8px 0 8px 20px; border-bottom:1px solid #e9e9e9;} 
</style>
<title>장돌뱅이 ~대한민국 전통시장을 응원합니다~</title>
<link href="/Jangdolbaeng2/css/customer/common1.css" rel="stylesheet">
<link href="/Jangdolbaeng2/css/bootstrap.min.css" rel="stylesheet">
<link href="/Jangdolbaeng2/css/customer/common.css" rel="stylesheet">
<script src="/Jangdolbaeng2/js/jquery-1.11.1.js"></script>
<script src="/Jangdolbaeng2/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	var sum = 0;
	for(i = 0; i < '${realCart.size()}'; i++){
		sum =  sum + parseInt($('#' + i).attr('value'));
	}

	deliveryCharge(sum);
});

function deliveryCharge(sum){
	//alert(sum);
	if(sum < 30000){
		sum = sum + 2500;
		$("#totalPrice").html(sum + '원');
		$("#totalPrice2").html(sum + '원');
	} else if (sum >= 30000) {
		$("#totalPrice").html(sum + '원');
		$("#totalPrice2").html(sum + '원');
	}
}

//배송처리
$(document).ready(function(){
	var delivery = '${product_order.order_type}';
	//alert(delivery);
	if(delivery == 'd'){
		$("#delivery").html('직접수령');
	} else if (delivery == 's') {
		$("#delivery").html('익일배송');
	}
});
</script>
</head>
<body>
<div id="head">
<%@ include file="main_header.jsp" %>
</div>

<!-- 
	주문 완료 이미지
 -->
<div id="box">
	<div style="padding: 20px 0 10px 20px;">
		<div id="content">
			<table>
				<tr>
					<td style="padding-right: 170px;">
						<span style="font-size: 40pt; font-family: nanumBB;">ORDER</span><span style="font-size: 40pt;">&nbsp;SHEET</span>
					</td>
					<td style="padding-right: 15px;">
						<h1><span class="glyphicon glyphicon-briefcase" style="color: #b7b7b7;"></span></h1>
					</td>
					<td style="padding-right: 20px;">
						<span style="font-family: fantasy; color: #b7b7b7;">STEP<span style="color: #b7b7b7;">&nbsp;01</span></span><br>
						<h4><span style="color: #b7b7b7;">장바구니</span></h4>
					</td>
					<td style="padding-right: 20px;">
						<h1><span class="glyphicon glyphicon-chevron-right" style="color: #b7b7b7;"></span></h1>
					</td>
					<td style="padding-right: 20px;">
						<h1><span class="glyphicon glyphicon-credit-card" style="color: #b7b7b7;"></span></h1>
					</td>
					<td style="padding-right: 20px;">
						<span style="font-family: fantasy; color: #b7b7b7;">STEP<span style="color: #b7b7b7;">&nbsp;02</span></span><br>
						<h4><span style="color: #b7b7b7;">주문/결제</span></h4>
					</td>
					<td style="padding-right: 20px;">
						<h1><span class="glyphicon glyphicon-chevron-right" style="color: #b7b7b7;"></span></h1>
					</td>
					<td style="padding-right: 20px;">
						<h1><span class="glyphicon glyphicon-gift" style="color: #FF6002;"></span></h1>
					</td>
					<td style="padding-right: 20px;">
						<span style="font-family: fantasy;">STEP<span style="color: #FF6002;">&nbsp;03</span></span><br>
						<h4><span>주문완료</span></h4>
					</td>
				</tr>
			</table>
		</div>
	</div>
	<div id="top_line"></div>
	<div id="finish">
		<div style="padding-left: 220px;">
			<span class="glyphicon glyphicon-gift" style="color: #FF6002; font-size: 50pt;"></span><br>
		</div>
		<div style="padding-left: 130px;">
			<u><span style="font-size: 25pt;">고객님 감사합니다</span></u><br>
		</div>
		<u><span style="font-size: 30pt; font-weight: nanumBB;">주문서 작성이 완료되었습니다.</span></u>
	</div>
</div>

<div id="order_finish">

	<!-- 
		주문내역확인
	-->
	<div style="padding-bottom: 50px;">
		<p class="order_title">
			<img alt="주문내역확인" src="../img/customer/order_title1.gif">
		</p>
		<table class="order_table">
			<thead class="thead">
				<tr>
					<th>주문번호</th>
					<th colspan="2">상품명</th>
					<th>주문금액</th>
					<th>수량</th>
				</tr>
			</thead>
			<s:iterator value="realCart" status="stat">
			<input type="hidden" value="<s:property value="product_price * quantity"/>" id="<s:property value="#stat.index"/>"/>
				<tbody style="text-align: center;">	
					<tr>
						<td style="width: 170px;">
							<strong><s:property value="order_seq"/></strong>
						</td>
						<td class="img" style="width: 150px;">
							<a href="/Jangdolbaeng2/product/goProduct_detail.action?product_seq=<s:property value="product_seq"/>">
							<img src="data:image/jpeg;base64, <s:property value="product_image1" />" width="50px"/></a>
						</td>
						<td class="left" style="width: 450px;">
							<a href="/Jangdolbaeng2/product/goProduct_detail.action?product_seq=<s:property value="product_seq"/>"><s:property value="product_name"/></a>
						</td>
						<td>
							<s:property value="product_price"/>원
						</td>
						<td>
							<s:property value="quantity"/>
						</td>
					</tr>
				</tbody>
			</s:iterator>
		</table>
	</div>
	<!-- 
		결제정보확인
	-->
	<div style="padding-bottom: 50px;">
		<div style="height:20px; margin:14px 0 10px; padding-top: 10px;">
			<p style="float:left;">
				<img src="../img/customer/order_title7.gif" alt="결제정보" style="padding-right:165px;">
			</p>
			<p style="padding-bottom:10px;"><img src="../img/customer/reference.gif"></p>
		</div>
		<div class="pay" style="margin-top: 128px;">
			<table class="table_style">
				<tbody>
					<tr>
						<th style="background:#f9f9f9; font-weight:bold;">결제방법</th>
						<th style="background:#f9f9f9; font-weight:bold;">주문총액</th>
						<th style="background:#f9f9f9; font-weight:bold;">결제금액</th>
					</tr>
					<tr>
						<td><strong>무통장 입금</strong></td>
						<td><strong id="totalPrice"></strong></td>
						<td><strong id="totalPrice2"></strong></td>
					</tr>
				</tbody>
			</table>
			<table class="table_style2" style="border-top:none;">
			<tbody>
				<tr>
					<th>입금 계좌</th>
					<td colspan="3">
						국민은행123456-78-900000 장돌뱅이(입금자명:<s:property value="delivery.name"/>)
					</td>
				</tr>
			</tbody>
		</table>
		</div>
	</div>
	<!-- 
		배송지정보확인 
	 -->
	<div style="height:20px; margin:14px 0 10px;">
		<p style="float:left;">
			<img src="../img/customer/order_title3.gif" alt="배송지 정보" style="padding-right:165px;">
		</p>
	</div>
	<div style="position:relative;">
		<table class="table_style2">
			<tbody>
				<tr>
					<th>받는 이</th>
					<td><s:property value="delivery.name"/></td>
					<th>배송 선택</th>
					<td id="delivery">
						<input type="hidden" value="<s:property value="product_order.order_type"/>">
						<s:property value="product_order.order_type"/>
					</td>
				</tr>
				<tr>
					<th>주소</th>
					<td>
						<s:property value="delivery.address1"/><s:property value="delivery.address2"/>
					</td>					
					<th>휴대폰 번호</th>
					<td colspan="3"><s:property value="delivery.phone"/></td>
				</tr>
			</tbody>
		</table>
	</div>

	<!-- 주문버튼 -->
	<div id="order1" class="btn" style="padding:15px 400px 60px;">
		<p class="order_email">주문정보를&nbsp;&nbsp;<span><s:property value="customer.email"/></span>으로 발송해 드렸습니다.</p>
		<a href="/Jangdolbaeng2/product/goDelivery.action">
  			<img src="../img/customer/order_list_new.gif" alt="주문/배송조회">
		</a>
		<a href="/Jangdolbaeng2/product/goMain.action">
			<img src="../img/customer/btn_cart5.gif" alt="쇼핑계속하기">
		</a>
	</div>
</div>

<div id="footer">
	<%@ include file="main_footer.jsp" %>
</div>
</body>
</html>